<template>
	<view>
		<view>
			<image class="bg-img" src="../../static/index/img3.jpg"></image>
		</view>
		<view>
			<view class="mycontent" v-for="(item, index) in result" :key="index">
				<view class="mylabel">
					<view><label class="myfont"></label></view>
				</view>
				<view class="listdiv">
					<view class="tubiao">
						<uni-icons type="person" color="DarkGoldenRod " size="30"></uni-icons>
					</view>
					<view class="zhuxiao">教师姓名：{{item.teacherInfo.teacherName}}</view>
					<view class="sanjiao"></view>
				</view>
				<view class="listdiv">
					<view class="tubiao">
						<uni-icons type="home" color="DarkBlue  " size="30"></uni-icons>
					</view>
					<view class="zhuxiao">所教学院：{{item.academyName}}</view>
					<view class="sanjiao"></view>
				</view>
				<view class="listdivd">
					<view class="tubiao">
						<uni-icons type="info" color="SeaGreen" size="30"></uni-icons>
					</view>
					<view class="zhuxiao">所在职位：{{item.roleName}}</view>
					<view class="sanjiao"></view>
				</view>

			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				result: [],
			};
		},
		mounted() {
			this.getDate();
		},
		methods: {
			getDate() {
				uni.request({
					url: 'https://backendth.flymi.top/teacher',
					method: 'GET',
					data: {},
					success: res => {
						this.result = res.data.data;
					},
					fail: () => {},
					complete: () => {}
				});
			}
		}

	}
</script>

<style>
	.rdiv {
		height: 400px;
		width: auto;
		background-color: white;
		background-color: rgba(255, 255, 255, 0.5);
		margin-left: 4px;
		margin-right: 4px;
		margin-top: 2px;
	}

	.bg-img {
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		z-index: -1;
	}

	.mycontent {
		background-color: white;
		border-radius: 10px;
		margin-left: 5px;
		margin-right: 5px;
		background-color: rgba(255, 255, 255, 0.7);
	}

	.mylabel {
		margin-bottom: 10px;
	}

	.myfont {
		font-weight: bolder;
	}

	.listdiv {
		display: flex;
		align-items: center;
		border-bottom: 2px darkgrey solid;
		height: 50px;
		font-weight: bolder;
	}

	.sanjiao {
		font-family: '微软雅黑';
		color: dimgrey;
		font-weight: bolder;
		margin-left: 40%;
	}

	.zhuxiao {
		margin-left: 15px;
		color: dimgrey;
		font-family: '微软雅黑';
		font-weight: bolder;
		float: left;

	}

	.tubiao {
		display: flex;
		margin-left: 5px;
		float: left;
	}

	.listdivd {
		display: flex;
		align-items: center;
		height: 50px;
	}
</style>
